<template>
  <section class="jumbotron">
      <h3 class="jumbotron-heading">Search Github Users</h3>
      <div>
        <input type="text" v-model="searchText" placeholder="enter the name you search"/>&nbsp;
        <button @click="searchUsers">Search</button>
      </div>
    </section>
</template>

<script>
// import axios from 'axios'
export default {
    name: "SearchUser",
    data(){
        return {
            searchText: ''
        }
    },
    methods:{
        searchUsers(){
            this.$bus.$emit('updateList',{users:[],isFirst:false,isLoading:false,errMsg:false})
            this.$http.get('https://api.github.com/search/users?q=' + this.searchText).then(
                response => {
                    this.$bus.$emit('updateList',{users:response.data.items,isLoading:false,errMsg:false})  
                },
                error => {
                    this.$bus.$emit('updateList',{users:[],isLoading:false,errMsg:error})                    
                }
            )
        
        }
        }
    }
</script>

<style>

</style>